<template>
	<view class="success-container">
		<view class="success-icon-box">
			<image class="success-icon" src="../../static/img/pay-success.png" mode=""></image>
		</view>
		<view class="pay-success-title">支付成功!</view>
		<view class="pay-success-sub-title">您已成功支付，感谢您的购买!</view>
		<view class="act-btn-box">
			<view class="back btn" @tap="goIndex">返回首页</view>
			<view class="order btn" @tap="goOrder">查看订单</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			goIndex() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			goOrder() {
				uni.navigateTo({
					url: '/pages/order/order-list'
				})
			}
		}
	}
</script>

<style scoped>
 .success-container {
	 background-color: #F0F1F5;
	 position: absolute;
	 bottom: 0;
	 top: 0;
	 left: 0;
	 right: 0;
 }
 
 
 .success-icon-box {
	 width: 100%;
	 margin-top: 150rpx;
	 text-align: center;
 }
 
 .success-icon {
	 width: 260rpx;
	 height: 260rpx;
 }
 
 .pay-success-title {
	 text-align: center;
	 font-weight: 500;
 }
 
 .pay-success-sub-title {
	 text-align: center;
	 margin-top: 10rpx;
	 color: #2F2F2F;
 }
 
 .act-btn-box {
	 width: 70%;
	 display: flex;
	 justify-content: space-between;
	 margin: 100rpx auto;
 }
 
 .btn {
	 text-align: center;
	 padding: 10rpx 50rpx;
	 font-size: 26rpx;
	 box-sizing: border-box;
	 border-radius: 40rpx;
	 border: #F24644 2rpx solid;
 }
 
 .order {
	background-color: #F24644;
	color: #FFFFFF;
 }
 
 .back {
	 background-color: #FFFFFF;
 }
</style>
